<template>
	<view class="content">
		<block v-if="orderList.length > 0">
			<view class="item" v-for="(item, index) in orderList" :key="index" @click="backOrderTo(item)">
				<view class="name-box">
					<view class="left">
						<image src="/static/me/order-adress.png"></image>
					</view>
					<view class="right">
						<view class="box1">
							<text class="text1">{{item.name}}</text>
							<text class="text2">{{item.mobile}}</text>
						</view>
						<view class="box2">{{item.addressPathDes}}{{item.detailAddress}}</view>
					</view>
				</view>
				<view class="mr-box">
					<view class="left" @click.stop="changeMr(item)">
						<image :src="item.defaultSelected==1?'/static/xz.png':'/static/ysxyx.png'"></image>
						<text class="texta">{{item.defaultSelected==1?'默认地址':'设为默认'}}</text>
					</view>
					<view class="right">
						<view class="btn2" @click.stop="deleteAddress(item.id)">删除</view>
						<view class="btn1" @click.stop="goDetails('change',item)">编辑</view>
					</view>
				</view>
			</view>
		</block>
		<block v-else>
			<view class="kong"><my-kong></my-kong></view>
		</block>
		<view class="btn-box">
			<view class="btn" @click="goDetails('add')">新增</view>
		</view>
	</view>
</template>

<script>
var _this;
export default {
	data() {
		return {
			orderList: [],
			eventOp:null,
			backOrder:false,
		};
	},
	onLoad(options) {
		_this = this;
		this.eventOp = this.getOpenerEventChannel()
		if(options.type&&options.type=='order'){
			_this.backOrder=true;
		}else{
			_this.backOrder=false;
		}
	},
	onShow() {
		_this.getList();
	},
	methods: {
		backOrderTo(item){
			if(!_this.backOrder){
				return;
			}
			uni.navigateBack({
				delta: 1,
				success:()=>{
					_this.eventOp.emit('addressItem',item) //返回的时候，携带所需要的数据
				}
			})
		},
		getList(){
			_this.$HTTP({
				method: 'GET',
				url: 'shopServer/address/getMyAddressList',
				data: {
					time: Date.parse(new Date())
				}
				// header:'form'
			}).then(res => {
				_this.orderList = res;
			}).catch(err => {
				console.log(err);
			});
		},
		deleteAddress(id){
			uni.showModal({
				title: '温馨提示',
				content: '确定要删除该地址？',
				success: function (res) {
					if (res.confirm) {
						_this.$HTTP({
							method: 'POST',
							url: 'shopServer/address/deleteAddress',
							data: {
								id: id,
								time: Date.parse(new Date())
							},
							header:'form'
						}).then(res => {
							_this.$api.msg('删除成功！');
							_this.getList();
						}).catch(err => {
							console.log(err);
						});
					}
				}
			});
		},
		changeMr(item){
			if(item.defaultSelected==1){
				return;
			}
			_this.$HTTP({
				method: 'POST',
				url: 'shopServer/address/updateDefaultAddress',
				data: {
					id: item.id,
					time: Date.parse(new Date())
				},
				header:'form'
			}).then(res => {
				_this.$api.msg('设置成功！');
				_this.getList();
			}).catch(err => {
				console.log(err);
			});
		},
		goDetails(type,item){
			let url='';
			if(type=='add'){
				url='/pages/index/addAddress';
			}else{
				url='/pages/index/addAddress?data='+JSON.stringify(item);
			}
			_this.$routerTo.navigateTo({
				path: url
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.kong {
	width: 100%;
	height: 800rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}
.content {
	width: 100%;
	box-sizing: border-box;
	padding: 0 0 190rpx 0;
	.item{
		width: 100%;
		margin-bottom: 16rpx;
		background: #FFFFFF;
		box-sizing: border-box;
		padding: 40rpx 40rpx 0 40rpx;
		.name-box{
			width: 100%;
			display: flex;
			align-items: flex-start;
			justify-content: space-between;
			.left{
				width: 66rpx;
				image{
					width: 66rpx;
					height: 66rpx;
				}
			}
			.right{
				width: 100%;
				margin-left: 15rpx;
				.box1{
					width: 100%;
					display: flex;
					align-items: flex-end;
					.text1{
						font-size: 36rpx;
						font-weight: bold;
						color: #333333;
					}
					.text2{
						font-size: 28rpx;
						color: #666666;
						margin-left: 20rpx;
					}
				}
				.box2{
					width: 100%;
					font-size: 28rpx;
					color: #666666;
					margin-top: 10rpx;
				}
			}
		}
		.mr-box{
			width: 100%;
			height: 120rpx;
			border-top: 2rpx solid #F0F0F0;
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 24rpx;
			.left{
				display: flex;
				align-items: center;
				image{
					width: 44rpx;
					height: 44rpx;
				}
				.texta{
					font-size: 28rpx;
					color: #999999;
					margin-left: 12rpx;
				}
			}
			.right{
				display: flex;
				align-items: center;
				.btn1{
					width: 150rpx;
					height: 56rpx;
					line-height: 56rpx;
					text-align: center;
					background: #4AA4FF;
					border-radius: 29rpx;
					font-size: 30rpx;
					color: #FFFFFF;
					margin-left: 30rpx;
				}
				.btn2{
					width: 150rpx;
					height: 56rpx;
					line-height: 56rpx;
					text-align: center;
					background: #CCCCCC;
					border-radius: 29rpx;
					font-size: 30rpx;
					color: #FFFFFF;
				}
			}
		}
	}
	.btn-box{
		width: 100%;
		height: 170rpx;
		position: fixed;
		left: 0;
		bottom: 0;
		box-sizing: border-box;
		padding: 0 40rpx;
		.btn{
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			border-radius: 50rpx;
			color: white;
			font-size: 32rpx;
			font-weight: bold;
			background: $my-color;
		}
	}
}
</style>
